import type { RouteRecordRaw } from "vue-router";
import indexDemo1 from "@/pagesrouter/01路由的基本切换效果/indexDemo1.vue";//路由的第一个案例,路由的基本切换效果
import About from "@/pagesrouter/01路由的基本切换效果/components/About.vue";
import Home from "@/pagesrouter/01路由的基本切换效果/components/Home.vue"
import News from "@/pagesrouter/01路由的基本切换效果/components/News.vue";

import indexDemo2 from "@/pagesrouter/02路由的两个注意点/indexDemo2.vue"; //路由的第二个案例
import AboutDemo2 from "@/pagesrouter/02路由的两个注意点/components/About.vue";
import HomeDemo2 from "@/pagesrouter/02路由的两个注意点/components/Home.vue";
import NewsDemo2 from "@/pagesrouter/02路由的两个注意点/components/News.vue";

import indexDemo3 from "@/pagesrouter/03路由query参数/indexDemo3.vue";//路由的第二个案例
import AboutDemo3 from "@/pagesrouter/03路由query参数/pages/About.vue";
import HomeDemo3 from "@/pagesrouter/03路由query参数/pages/Home.vue";
import NewsDemo3 from "@/pagesrouter/03路由query参数/pages/News.vue";
import DetailDemo3 from "@/pagesrouter/03路由query参数/pages/Detail.vue";
import DetailParams from "@/pagesrouter/03路由query参数/pages/DetailParams.vue";
import NewsParams   from "@/pagesrouter/03路由query参数/pages/NewsParams.vue";
import NewsCHongDingXiang  from "@/pagesrouter/03路由query参数/pages/NewsCHongDingXiang.vue";
import DetailChongDingXiang  from "@/pagesrouter/03路由query参数/pages/DetailChongDingXiang.vue";
const pagesrouter:RouteRecordRaw[]=[
    {
        path:'/indexdemo3',
        component:indexDemo3,
        children:[//设置二级目录
          {
              path: "/newsCHongDingXiang",
              name:'newsCHongDingXiangName',
              component:NewsCHongDingXiang,
              children:[
                {
                    path: 'detailCHongDingXiang',
                    name:'detailCHongDingXiangName',
                    component:DetailChongDingXiang,
                    // 路由的props配置知识点
                    // 第一种写法：将路由收到的所有params参数作为props传给路由组件
                    //props:true,
                    // 第二种写法：函数写法，可以自己决定将什么作为props给路由组件
                    /*
                    props(route){
                        return route.query
                    }*/

                    // 第三种写法：对象写法，可以自己决定将什么作为props给路由组件
                    /* props:{
                      a:100,
                      b:200,
                      c:300
                    } */
                }
            ]
          },
          {
              path:'/about3',
              component:AboutDemo3
          },
          {
              path:'/home3',
              component:HomeDemo3
          },
          {
              path: '/news3',
              component: NewsDemo3,
              children:[
                  {
                      path:'detail3',
                      name:"detail3",
                      component:DetailDemo3
                  }
              ]
          },
          {
              path: '/news3Params',
              name:'news3ParamsName',
              component:NewsParams,
              children:[
                  {
                        path:'detail3Params/:id/:title/:content?',
                        props:true,
                        //path:'detail3Params',
                        /*props(route) {
                            return route.query
                        },*/
                        name:'detail3ParamsName',
                        // 第一种写法：将路由收到的所有params参数作为props传给路由组件
                        // props:true,
                        component:DetailParams
                    }
              ]
          }
      ]
    },
    {
        path:'/indexdemo1',
        component:indexDemo1,
        children:[//设置二级目录
            {
                path:'/about',
                component:About
            },
            {
                path:'/home',
                component:Home
            },
            {
                path: '/news',
                component: News
            }
        ]
    },
    {
        path:'/indexdemo2',
        component:indexDemo2,
        children:[//设置二级目录
            {
                path:'/about2',
                component:AboutDemo2
            },
            {
                path:'/home2',
                component:HomeDemo2
            },
            {
                path: '/news2',
                component: NewsDemo2
            }
        ]
    },
    /*重定向知识的学习
    {
        path:'/',
        redirect:'/indexdemo2'
    }*/
]
export default pagesrouter;